<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			*{
				padding: 0px;
				margin: 0px;
			}
			#fk{
				width: 980px;
				height: 49px;
				border: 1px solid blue;
				margin: 30px auto;
				
			}
			#fk p.left{
				width: 260px;
				height: 49px;
				background: #B81C22;
				color: white;
				line-height: 49px;
				font-size: 17px;
				font-family: "微软雅黑";
				text-align: center;
				float: left;
			}
			#fk .right{
			width: 720px;
			height: 49px;
			/*background: #EFEFEF;*/
			float: left;	
			}
			#fk .right a{
				display: block;
				width: 90px;
				height: 49px;
				float: left;
				line-height: 49px;
				font-family: "微软雅黑";
				font-size: 16px;
				color: #727171;
				text-decoration: none;
				text-align: center;
				
				
			}
			#fk .right a:hover{
				background: #E5E6E6;
				color: #B81C22;
			}
			/**{
				padding: 0;
				margin: 0;*/
			}
			#top{
				width: 100%;
				height: 32px;
				background: #666;
			}
			#top .center{
				width: 1200;
				height: 32px;
				/*background: forestgreen;*/
				margin: 0 2;
			}
			#search{
				width: 1200px;
				height: 92px;
				/*background: #B81B22;*/
				margin: 0 auto;
			}
			#flash{
				width: 1200px;
				height: 474px;
				border: 3px solid blue;
				margin: 0 auto;
			}
			#flash .left{
				width: 260px;
				height: 475px;
				/*background: blueviolet;*/
				float: left;
				
			}
			#flash .center{
				float: left;
				margin-left: 10px;
				margin-right: 10px;
				float: left;
				}
			#flash .right{
					width: 210px;
					height: 475px;
					/*background: yellowgreen;*/
					float: left;
				}
			
			#flash .lest #fk1{
				width: 260px;
				height: 474px;
				border-bottom: 1px solid green;
				border-right: 1px solid green;
				margin: 30px;
				position: relative;
				float: left;
			
				
			}
			#flash .left #fk1 #man{
				width: 258px;
				height: 257px;
				border: 1px solid red;
				position: relative;
				
			}
			#flash .left #fk1 #man .title{
				color: #B81C22;
				font-size: 14px;
				position: absolute;
				left: 35px;
				top: -8px;
				background: white;
				padding: 0 4px;
				
			}
			#flash .left #fk1 #man .one{
				width: 258px;
				height: 71px;
				border-bottom: 1px solid red;
				position: relative;
			}
			#flash .left #fk1 #man .one .t{
				font-size: 14px;
				color: #A3A2A2;
				text-decoration: none;
				font-family: "微软雅黑";
				line-height: 20px;
				position: absolute;
				left: 36px;
				top: 20px;
				
			}
			#flash .left #fk1 #man .one p.tags{
			position: absolute;
			left: 36px;
			top: 43px;	
			}
			#flash .left #fk1 #man .one p.tags a{
				text-decoration: none;
				font-size: 12px;
				color: #727171;
				float: left;
				line-height: 20px;
				margin-right: 17px;
			}
			#flash .left #fk1 #man .one p.tags a.index{
				color: #B81C22;
			}
	#xt{
		width: 1200px;
		/*height: 1200px;*/
		border: 1px solid white;
		margin: 0 auto;
	}
	#ct{
		width: 1200px;
		/*height: 1200px;*/
		border: 1px solid white;
		margin: 0 auto;
	}
	
	.xt5{
		text-align: right;
		margin: 0 auto;
	}
	#xt .xt1{
		padding-left: 0px;
	}
	#xt img {
		
		width: 236px!important;
	}
	/*以下为搜索区域*/
	#search{
		width: 1200px;
		height: 93;
		border: 1px solid blue;
		margin: 40px auto;
		position: relative;
	} 
	#search a.logo{
		width: 166px;
		height: 47px;
		display: block;
		background: url(fanke.png) no-repeat 0px -59px;
		position: absolute;
		left 33px;
		top 20px;
	}
	#search form{
		width: 437px;
		height: 27px;
		border: 1px solid #C9CACA;
		position: absolute;
		left: 642px;
		top: 28px;
		
	}
	#search form .keyword{
		width: 389px;
		height: 27px;
		/*取消所有边框*/
		border: none;
		border-right: 1px solid #C9CACA;
		color: #000;
		font-size: 12px;
		text-indent: 5px;
		float: left;
		}
		#search form .sub{
		width: 47px;
		height: 27px;
		background: #B81C20;
		border: none;
		color: white;
		font-size: 13px;
		float: left;	
		}
		#search p.tags{
		position: absolute;
		top: 62px;
		left: 694px;	
		}
		
		#search p.tags span{
			font-size: 12px;
			color: #727171;
			float: left;
			line-height: 20px;
			margin-right: 5px;
			
		}
		#search p.tags a{
			font-size: 12px;
			color: #727171;
			text-decoration: none;
			float: left;
			line-height: 20px;
			margin-right: 11px;
		}
		#search p.tags a:hover{
			color: #B81C22;
			text-decoration: underline;
			
		}
		#search a.cart{
			display: block;
			height: 29px;
			width: 107px;
			border: 1px solid green;
			position: absolute;
			right: 0;
			top: 28px;
			background: url(fanke.png) no-repeat -153px 0;
			color: white;
			font-size: 12px;
			line-height: 29px;
			text-decoration: none;
			text-indent: 30px;
			
		}
		/*以下为搜索区域结束*/
		</style>
	</head>
	<body>
		<div id="ct">
			<img src="ct.jpg" class=""/>
		</div>
			
		
		<div id="fk">
			<p class="left">全部商品分类</p>
			<div class="right">
				<a href="">nautilus</a>
				<a href="">羽绒服</a>
				<a href="">衬衫</a>
				<a href="">外套</a>
				<a href="">针织衫</a>
				<a href="">休闲裤</a>
				<a href="">牛仔</a>
				<a href="">断码区</a>
			</div>
		</div>
		<div di="top">
			<div class="center">
				
			</div>
			<!--以下为凡客搜索区域-->
			<div id="search">
			   <a href="" class="logo"></a>
		        <form action="">
			      <input type="text" class="keyword"   value="搜“针织衫”，体验与众不同"/>
		          <input type="text" class="sub" value="搜索"/>
		        </form>	
		        <p class='tags'>
		        	<span>热门搜索：</span>
		        	<a href="">衬衫</a>
		        	<a href="">羽绒服</a>
		        	<a href="">针织衫</a>
		        	<a href="">羊毛外套</a>
		        	<a href="">休闲裤</a>
		        	<a href="">牛仔裤</a>
		        </p>
		        
		        <a href="" class='cart'>购物车</a>
		        
			</div>
			<!--以下为凡客搜索区域结束-->
		</div>
		<div id="flash">
			<div class="left">
		       <div id="fk1">
			    <div id="man">
				<p class="title">男装</p>
				<div class="one">
					<a href="" class="t">衬衫</a>
					<p class="tags">
						<a href="" class="index">针织衫</a>
						<a href="">羊毛衫</a>      
						<a href="">羊绒衫</a>
						<a href="">棉线衫</a>
					</p>
				</div>
				
				<div class="one">
					<a href="" class="t">针织衫</a>
					<p class="tags">
						<a href="" class="index">羊毛衫 </a>     
						<a href="">羊绒衫</a>
						<a href="">棉线衫</a>
						<a href="">牛津纺</a>
					</p>
				</div>
				
				<div class="one">
					<a href="" class="t">外套</a>
					<p class="tags">
						<a href="" class="index">羽绒服</a>
						<a href="">冲锋衣</a>
						<a href="">羊毛外套</a>
						<a href="">卫衣</a>
       
					</p>
				</div>
			</div>
		</div>
		<!--</div>-->
			
		</div>
		<img src="fanke.jpg" class="center"/>
			<div class="right">
			    <img src="youshan.jpg"/>
		        <img src="youxia.jpg"/>
			</div>
	<div id="xt">
	    <img src="xt1.jpg" alt="" class="xt1"/>
	    <img src="xt2.jpg" alt="" class="xt2"/>
	    <img src="xt3.jpg" alt="" class="xt3"/>
	    <img src="xt4.jpg" alt="" class="xt4"/>
	    <img src="xt5.jpg" alt="" class="xt5"/>
	    <img src="xt6.jpg" alt="" class="xt6"/>
	    <img src="xt7.jpg" alt="" class="xt7"/>
	    <img src="xt8.jpg" alt="" class="xt8"/>
	    <img src="xt9.jpg" alt="" class="xt1"/>
	    <img src="xt10.jpg" alt="" class="xt2"/>
	    <img src="xt1.jpg" alt="" class="xt3"/>
	    <img src="xt1.jpg" alt="" class="xt4"/>
	    <img src="xt1.jpg" alt="" class="xt5"/>
	    <img src="xt1.jpg" alt="" class="xt6"/>
	    <img src="xt1.jpg" alt="" class="xt7"/>
	    <!--<img src="xt1.jpg" alt="" class="xt8"/>-->
	</div>
	<!--搜索区域-->
	
	
	
	</body>
</html>
